import React, { Component } from 'react';
import {messages} from "share/common";
import {Alert, Badge, Button, message, Modal, Select} from "antd";
const Option = Select.Option;
import financeViewService from "./expense-view.service";

class GenerateBatch extends Component {

  state = {
    modalVisible: false,
    batchBtnLoading: false,
    batchSize: 100
  };

  //报销单 - 生成批次
  toGenerateExpenseBatch = () => {
    this.setState({ batchBtnLoading: true });
    const { searchParams, onCreate } = this.props;
    const { batchSize } = this.state;
    let arr = []
    if (searchParams.status && searchParams.status.length > 0) {
      if (searchParams.status.includes('auditReview')) {
        arr = searchParams.status.filter(item => item !== 'auditReview')
        searchParams.auditReview = true;
      } else {
        arr = searchParams.status
      }
    }
    searchParams.status = arr;
    financeViewService.createBatch({ ...searchParams, batchSize }).then(res => {
      this.setState({ batchBtnLoading: false });
      if (res.data.total) {
        this.setState({ modalVisible: false });
        message.success(messages('financial-management.key601')/*批次生成成功*/);
        onCreate();
      } else {
        message.error(messages('financial-management.key602')/*批次号为空的单据才可生成批次！*/)
      }
    }).catch(() => {
      this.setState({ batchBtnLoading: false })
    })
  };

  render() {
    const { modalVisible, batchSize, batchBtnLoading } = this.state;
    return (
      <Button
        onClick={() => this.setState({ modalVisible: true })}
      >
        {messages('financial-management.key33')/*生成批次*/}
        <Modal
          visible={modalVisible}
          title={messages('financial-management.key33')/*生成批次*/}
          className='expense-view-modal-container'
          footer={[
            <Button
              key="cancel"
              onClick={() => this.setState({ modalVisible: false })}
            >
              {messages('common.cancel')}
            </Button>,
            <Button
              key="ok"
              type="primary"
              loading={batchBtnLoading}
              onClick={this.toGenerateExpenseBatch}
            >
              {messages('common.ok')}
            </Button>
          ]}
          onCancel={() => this.setState({ modalVisible: false })}
        >
          <Alert
            type="info"
            showIcon
            message={
              messages('financial-management.key608')
              /*当批次中数量过大可能导致打印失败，请根据您的机器性能进行选择。推荐：100条/批*/
            }
          />
          <div className="set-batch-size">
            {messages('financial-management.key31')/*设置打印批次*/}
            :
            <Select value={batchSize} onChange={value => this.setState({batchSize: value})}>
              <Option key={100}>100</Option>
              <Option key={200}>200</Option>
              <Option key={500}>500</Option>
            </Select>
            /
            {messages('financial-management.key32')/*批*/}
          </div>
        </Modal>
      </Button>
    );
  }
}

export default GenerateBatch;
